.rtl {
	direction: rtl;

	& .rc-old .buttons-group .button {
		margin-right: 4px;
		margin-left: auto;

		&:first-child {
			margin-right: 0;
		}
	}

	& .rc-old .page-container .content .rocket-form .submit {
		text-align: left;
	}

	& button {
		text-align: right;
	}

	& .main-content {
		left: 0;

		transition: left 0.25s cubic-bezier(0.5, 0, 0.1, 1);

		&.flex-opened {
			left: calc(var(--flex-tab-width) + 40px);
		}
	}

	& .page-settings {
		& .content > .info {
			padding-left: 20px;
		}

		& .section {
			border-right: none;
			border-left: 1px solid #dddddd;

			& .section-content .input-line > label {
				text-align: right;
			}
		}
	}

	& .messages-box {
		margin: 60px 0 0;

		& .new-message {
			right: 50%;
			left: auto;
		}

		&.compact {
			& .message {
				padding: 5px 45px 5px 15px;

				&.collapsed .thumb {
					margin: 0;
				}
			}
		}
	}

	& .container-bars {
		& .upload-progress {
			& .upload-progress-progress {
				right: 0;
				left: auto;
			}

			& .upload-progress-text > a {
				float: left;
			}
		}

		& .unread-bar {
			& > a.mark-read {
				float: left;
			}

			& > a.jump-to {
				float: right;
			}
		}
	}

	& .messages-container {
		right: 0;
		left: auto;

		& .wrapper {
			right: 0;
			left: auto;
		}

		& .footer {
			right: 0;
			left: auto;
		}
	}

	& .flex-tab .control {
		padding: 12px 30px;

		text-align: right;

		& > a,
		& > form {
			float: right;
		}

		& .more {
			right: 0;
			left: auto;

			transform: translateX(27px);
		}

		& .search-form {
			width: 100%;
			padding: 0 0 0 4px;

			& .icon-plus {
				right: 4px;
				left: auto;
			}
		}

		& .info-tabs {
			right: auto;
			left: 20px;

			text-align: left;
		}
	}

	& .flex-opened .flex-tab .control .more {
		transform: translateX(0);
	}

	& .input-line {
		&.search {
			& .icon-spin {
				right: auto;
				left: 5px;
			}

			& .icon-search,
			& .icon-right-open-small {
				right: 2px;
				left: auto;
			}

			& input {
				padding-right: 20px;
				padding-left: 8px;

				text-align: right;
			}
		}

		& > div .right {
			right: auto;
			left: 10px;
		}

		&.double-col {
			& > label {
				float: right;

				padding: 10px 0 10px 20px;

				text-align: left;
			}

			& > div {
				float: right;

				& label {
					margin-right: auto;
					margin-left: 4px;

					&:nth-last-child(1) {
						margin-right: auto;
						margin-left: 0;
					}

					& input {
						margin-right: auto;
						margin-left: 4px;
					}
				}
			}
		}
	}

	& .user-view {
		& nav {
			margin-right: -4px;
			margin-left: auto;

			& .back {
				float: left;
			}
		}

		& .stats li {
			border-right: unset;
			border-left: 2px;
		}
	}

	& .burger {
		right: 0;
		left: auto;

		margin-right: 7px;
		margin-left: auto;

		& .unread-burger-alert {
			right: auto;
			left: 4px;
		}

		&.menu-opened i {
			&:nth-child(1) {
				transform: translate(25%, 3px) rotate(45deg) scale(0.5, 1);
			}

			&:nth-child(3) {
				transform: translate(25%, -3px) rotate(-45deg) scale(0.5, 1);
			}
		}
	}

	& .arrow {
		&::before,
		&::after {
			right: calc(50% - 5px);
		}

		&::before {
			transform: rotate(135deg) translateX(4px);
		}

		&::after {
			transform: rotate(-135deg) translateX(4px);
		}

		&.left {
			&::before {
				transform: rotate(-45deg) translateY(-4px);
			}

			&::after {
				transform: rotate(45deg) translateY(4px);
			}
		}

		&.top {
			&::before {
				transform: rotate(45deg) translateX(-2px) translateY(2px);
			}

			&::after {
				transform: rotate(-45deg) translateX(2px) translateY(2px);
			}
		}

		&.bottom {
			&::before {
				transform: rotate(-45deg) translateX(-2px) translateY(-2px);
			}

			&::after {
				transform: rotate(45deg) translateX(2px) translateY(-2px);
			}
		}

		&.close {
			&::before {
				transform: rotate(-45deg);
			}

			&::after {
				transform: rotate(45deg);
			}
		}
	}

	& .message {
		padding-right: 70px;
		padding-left: 20px;

		& .user {
			margin-right: 0;
			margin-left: 5px;
		}

		& .thumb {
			right: 20px;
			left: auto;
		}

		& .title .edited {
			margin-right: 3px;
			margin-left: auto;
		}

		& .private {
			margin-right: 10px;
			margin-left: auto;
		}

		&.sequential {
			padding-top: 4px;

			& .title {
				right: 5px;
				left: auto;

				text-align: left;

				& .edited {
					margin-right: 0;
					margin-left: auto;
					padding-right: 0;
					padding-left: auto;

					border-right: 0;
				}

				& .message-action {
					float: right;

					margin-right: 1px;
					margin-left: auto;
				}
			}
		}

		&.collapsed {
			& > .thumb {
				margin: 0 16px 0 0;
			}
		}
	}

	& blockquote {
		padding-right: 10px;
		padding-left: auto;

		&::before {
			right: 0;
			left: auto;
		}
	}

	& .ticks-bar {
		right: auto;
		left: 2px;
	}

	& .fixed-title {
		right: 0;
		left: auto;

		padding: 0 20px 0 10px;
	}

	& .list-view {
		& > .title .see-all {
			float: left;
		}
	}

	& .page-list .list {
		& a .info ul {
			margin-right: 3px;
			margin-left: auto;
		}

		& table thead th {
			text-align: right;
		}
	}

	& .code-mirror-box {
		direction: ltr;

		& .buttons {
			text-align: left;
		}

		&.code-mirror-box-fullscreen {
			right: 260px;
			left: 40px;

			& .title {
				padding-right: 10px;
				padding-left: unset;
				direction: rtl;
			}
		}
	}

	& .rocket-form {
		& legend::after {
			right: 0;
		}

		& .submit {
			text-align: left;
		}
	}

	/* Override toastr messages to show on the left side */
	& .toast-top-right {
		right: auto;
		left: 12px;
	}

	@media (width <= 1100px) {
		& #rocket-chat .flex-opened {
			left: 0;

			& .flex-tab {
				transform: translateX(calc(100% + 40px));
			}
		}
	}

	@media (width <= 780px) {
		& #rocket-chat {
			& .main-content {
				right: 0;
			}

			& .fixed-title h2 {
				margin-right: 45px;
			}
		}

		& .code-mirror-box.code-mirror-box-fullscreen {
			right: 0;
		}
	}
}
